import 'package:flutter/material.dart';
import 'gamePage.dart';
class SearchPage extends StatefulWidget{
  @override
  _SearchPageState createState() {
    // TODO: implement createState
    return _SearchPageState();
  }
}
class _SearchPageState extends State<SearchPage> with AutomaticKeepAliveClientMixin{
  ScrollController controller;
  bool showTitle;
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    showTitle=false;
    controller=ScrollController();
    controller.addListener((){
      setState(() {
        showTitle=controller.position.pixels>=40;
      });
    });
  }
  @override
  Widget build(BuildContext context) {
    List<String> list=[
      "完美世界",
      "部落冲突",
      "王者荣耀",
      "樊登读书会",
      "pubg",
      "和平精英",
    ];
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: showTitle?Text("搜索"):Text(""),
        elevation: showTitle?1:0,
      ),
      body: Container(
        
        color: Colors.white,
        child: CustomScrollView(
          controller: controller,
          slivers: <Widget>[
            SliverToBoxAdapter(
              child: titleWidget("搜索"),
            ),
            SliverAppBar(
              pinned: true,
              elevation: 0,
              
              title: SearchTitle()
            ),
            SliverToBoxAdapter(
              child: Container(
                padding: EdgeInsets.only(left: 20,bottom: 5),
                child: Text("热门搜索",style: TextStyle(fontSize: 20,fontWeight: FontWeight.w500),),
              )
            ),
            SliverList(
              delegate: SliverChildBuilderDelegate(
                (context,index){
                  return SearchItem(name: list[index],);
                },
                childCount: list.length
              ),
            )
          ],
        ),
      ),
    );
  }

  @override
  // TODO: implement wantKeepAlive
  bool get wantKeepAlive => true;
}

class SearchTitle extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Container(
      padding: EdgeInsets.only(right: 20),
      child: Stack(
        alignment: Alignment.center,
        children: <Widget>[
          Container(
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(10.0),
              color: Color.fromRGBO(242, 242, 242, 1),
            ),
            margin: EdgeInsets.only(left: 5,right: 5),
            height: 35,
            width: double.infinity,
          ),
          Container(
            margin: EdgeInsets.only(left: 10),
            child: Row(
              children: <Widget>[
                Icon(Icons.search,
                color: Color.fromRGBO(127, 127, 127, 1),
                size: 20,
                ),
                Container(
                  margin: EdgeInsets.only(left: 5),
                  child: Text("App Store",
                  style: TextStyle(
                    color: Color.fromRGBO(127, 127, 127, 1),
                    fontSize: 16
                    ),
                    ),
                )
              ],
            ),
          )
        ],
      ),
    );
  }
}

class SearchItem extends StatelessWidget{
  String name;
  SearchItem({this.name});
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Container(
      padding: EdgeInsets.only(top: 5,bottom: 5),
      margin: EdgeInsets.only(left: 20,right: 40),
      decoration: BoxDecoration(
        border: Border(
          top: BorderSide(
            width: 0.1,
            color: Colors.grey
          )
        )
      ),
      child: Text(name,
      style: TextStyle(
        color: Colors.blueAccent,
        fontSize: 20
      ),
      ),
    );
  }
}